<template>
  <div id="app">
    <div id="nav">
      <h1 @click="show">{{ msg }}</h1>
      <!-- 3.引用组件 -->
      <app-head></app-head>
      <app-main></app-main>
      <!-- <router-link to="/">Home</router-link> |
      <router-link to="/about">About</router-link> -->
    </div>
    <!-- <router-view /> -->
  </div>
</template>
<script>
// import appHead from "@/components/appHead.vue"; //@指的是src目录
//1.引入组件
import appHead from "./components/appHead.vue"; //相对路径写法
import appMain from "./components/appMain.vue";
export default {
  data() {
    return {
      msg: "h52005-脚手架6666888",
    };
  },

  methods: {
    show() {
      alert("测试");
    },
  },

  //2.注册组件
  components: {
    appHead,
    appMain,
  },
};
</script>
<style lang="scss">
// 一般公共样式写在这里
#nav {
  padding: 50px;
  h1 {
    color: #58bc58;
  }
}

div {
  font-size: 38px;
}
</style>
